@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400&display=swap');

body {
    font-family: 'Poppins', sans-serif;
}

.container {
    display: none;
    font-family: 'Poppins', sans-serif;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgb(221, 221, 221);
    border-radius: 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border-top: solid 10px #1862a8;
}

.background {
    font-family: 'Poppins', sans-serif;
    position: absolute;
    top: 66%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgb(221, 221, 221);
    border-radius: 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


.background-topbar {
    position: absolute;
    left: 50%;
    top: 9%;
    transform: translate(-50%, -50%);
    background-color: rgb(186, 186, 186);
    width: 100%;
    border-radius: 5px;
    height: 20%;
}

#text-input:focus{
    border-bottom: 1px solid #0084ff;
    color: black
}

.input-field label:focus {
    color: rgb(61, 38, 38);
}

.beslag {
    display: none;
}

.search {
    display: none;
}

.polislogga {
    position: absolute;
    top: 15%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.playerName {
    color: rgba(0, 0, 0, 0.384);
    position: absolute;
    left: 50%;
    top: 30%;
    transform: translate(-50%, -50%);
    font-size: 16px;
}

.info {
    color: rgba(0, 0, 0, 0.384);
    position: absolute;
    left: 50%;
    top: 69%;
    transform: translate(-50%, -50%);
}

#toast-container {
    position: absolute;
    left: 50%;
    top: 80%;
    transform: translate(-50%, -50%);
    max-height: 500px;
    overflow-y: hidden;
    overflow-x: hidden;
    width: 370px;
}

.toast {
    color: black;
    background: rgb(221, 221, 221);
}
